<template>
    <div id="app" class="dialogue-wrap">
        <scroll-fixed ref="fixedbar">
            <page-bar>
                <div slot="middle" class="page-title">查看对话</div>
                <i slot="right"></i>
            </page-bar>
        </scroll-fixed>
        <scroll-list :disabled="true" :config="scroll" @bottom="loadmore">
            <section v-for="(section,index) in list" :key="index">
                <ui-comment v-for="item in section.list" :item="item" class="edit-item" @click.native="addItem(item)" :key="item.id"></ui-comment>
            </section>
        </scroll-list>
        <p class="comment-end" v-if="list.length">已显示全部内容</p>
    </div>
</template>
<script>
    import comment from "../components/comment.vue";
    import pageBar from "../components/pagebar.vue";
    import scrollFixed from "../components/scrollFixed.vue";
    import ScrollList from "../components/scrollList.vue";
    import _ from "lodash";

    export default {
        name: "dialogue",
        components: {
            [comment.name]: comment,
            [pageBar.name]: pageBar,
            [ScrollList.name]: ScrollList,
            [scrollFixed.name]: scrollFixed
        },
        data() {
            return {
                scroll: {
                    bottom: false
                },
                list: [],
            };
        },
        mounted() {
            this.getCommentList();
        },
        methods: {
            getCommentList() {
                
            },
            loadmore() {
                
            },
        }
    };
</script>
<style lang="less">
.dialogue-wrap {
    
    .comment-end {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 106px;
        color: #c6c6c6;
        font-size: 28px;
    }
}
</style>